<template>
	<!-- 联系提货点 -->
	<view class="Consultation">
		<!-- <view style="margin: 40upx 20upx;">
			<view class="dianpu_list">
				<image :src="location.head_img" mode=""></image>
				<view class="right_box">
					<p class="p1">
						<text class="text0">{{ location.shop_name }}</text>
						<text class="text2">距离您：{{location.range | setRange}}公里</text>
					</p>
					<p class="p2">{{location.mobile}}</p>
					<p class="p3">
						<image src="/static/img/home/morenweizhi.png" mode=""></image>
						<text class="text1">{{location.address}}</text>
					</p>
				</view>
				<p class="moren" :style="{ background: newColor.color }">当前提货点</p>
			</view>
		</view> -->
		<view class="tel_box">
			<p class="tel">
				<text :style="{ color: newColor.color }">电话:</text>
				{{ location.tel }}
			</p>
		</view>
		<view class="btns">
			<!-- #ifdef H5 -->
			<p :style="{ background: newColor.color }" @tap="copyTel">复制号码</p>
			<!-- #endif -->
			<!-- #ifdef MP-WEIXIN -->
			<p :style="{ background: newColor.color }" @tap="callTel">拨打电话</p>
			<!-- #endif -->
		</view>
	</view>
</template>

<script>
import {getUserInfo} from '../../../static/utils/ahth.js'
export default {
	data() {
		return {
			addList: [{ status: 0, name: '友善团购店' }],
			tel: '0558-123456',
			userinfo: getUserInfo(),
			location:{}
		};
	},
	filters:{
		setRange(value){
			if(!value){
				return 0
			}
			let data = Number(value) / 1000
			let newdata = data.toFixed(1)
			console.log(newdata)
			return newdata
		}
	},
	methods: {
		callTel() {
			//联系提货点
			uni.makePhoneCall({
				phoneNumber: this.location.tel
			});
		},
		copyTel() {
			console.log('点击了');
			let that = this;
			var input = document.createElement('input'); // 直接构建input
			input.value = this.location.tel; // 设置内容
			document.body.appendChild(input); // 添加临时实例
			input.select(); // 选择实例内容
			document.execCommand('Copy'); // 执行复制
			document.body.removeChild(input); // 删除临时实例
			uni.showToast({
				title:'复制成功'
			})
		},
		getdefault(){//获取平台电话
			this.request('common/getTel', {
			}).then(res => {
				console.log(res)
				this.location = res.data
			});
		},
	},
	onShow() {
		this.getdefault()
	}
};
</script>

<style lang="scss" scoped>
.dianpu_list {
	height: 160upx;
	background: rgba(255, 255, 255, 1);
	box-shadow: 0px 0px 21px 0px rgba(255, 74, 44, 0.1);
	border-radius: 15upx;
	box-sizing: border-box;
	padding: 20upx 30upx;
	position: relative;
	margin-top: 20upx;
	> image {
		width: 80upx;
		height: 80upx;
		float: left;
		border-radius: 50%;
		margin-top: 20upx;
	}
	.right_box {
		float: right;
		text-align: left;
		margin-left: 20upx;
		width: 80%;
		margin-top: 10upx;
		image {
			width: 30upx;
			height: 26upx;
			float: left;
			margin-top: 5upx;
		}
		.p1 {
			width: 100%;
			text-align: left;
			.text0 {
				font-size: 28upx;
				color: #333333;
			}
			.text2 {
				float: right;
				font-size: 24upx;
				color: #999999;
			}
		}
		.p2 {
			text-align: left;
			font-size: 24upx;
			color: #999999;
			margin-top: 5upx;
			margin-bottom: 5upx;
		}
		.text1 {
			font-size: 24upx;
			width: 70%;
			float: left;
			margin-left: 10upx;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			color: #999999;
		}
	}
	.moren {
		position: absolute;
		width: 160upx;
		height: 36upx;
		line-height: 36upx;
		background: rgba(242, 58, 58, 1);
		border-radius: 6upx;
		color: #ffffff;
		font-size: 22upx;
		top: -15upx;
		text-align: center;
	}
	.xuanze {
		width: 100upx;
		height: 46upx;
		line-height: 46upx;
		background: rgba(242, 58, 58, 1);
		border-radius: 23upx;
		position: absolute;
		bottom: 20upx;
		right: 20upx;
		font-size: 22upx;
		font-family: Droid Sans Fallback;
		font-weight: 400;
		color: rgba(255, 255, 255, 1);
		text-align: center;
	}
}
.tel_box {
	// text-align: center;
	margin-top: 50upx;
	.tel {
		height: 60upx;
		line-height: 60upx;
		font-size: 30upx;
		box-shadow: 0px 0px 21px 0px rgba(255, 74, 44, 0.1);
		margin: 20upx;
		border-radius: 15upx;
		padding: 10upx 0;
		box-sizing: content-box;
		text {
			float: left;
			width: 100upx;
			margin-left: 30upx;
		}
	}
}
.btns {
	text-align: center;
	margin-top: 200upx;
	p {
		width: 160px;
		height: 70upx;
		line-height: 70upx;
		background: rgba(242, 58, 58, 1);
		border-radius: 23px;
		margin: 0 auto;
		margin-bottom: 20upx;
		color: #ffffff;
		transition: all 0.3s;
		&:active {
			transform: scaleX(0.98);
		}
	}
}
</style>
